import Taro, { Component } from '@tarojs/taro'
import { View, Button } from '@tarojs/components'

import TopicInfoContent from './topicInfo'
import ReplyContent from './reply'
import SelfReply from './selfReply'

import {replyModalText} from '../../actions/topicListAction' 
import {checkUserLoginStatus} from '../../actions/userAction'

import './index.scss'

// const isWeApp = process.env.TARO_ENV === 'weapp'

class TopicInfo extends Component{
  state = {
    showReplyModal: false
  } 
  handlePlayOk(reply){
    this.props.onPlayTopicNice(reply)
  }
  handleReplyBtn(){
    let {user} = this.props
    checkUserLoginStatus(user).then(res => {
      if(res){
        this.setState({
          showReplyModal: true
        })
      }else{
        Taro.navigateTo({url: '/pages/login/index'})
      } 
    })
    
  }
  closeShowReplyModal(){
    this.setState({
      showReplyModal: false
    })
  }
  handleReplyPlayOk(content){
    let {user, info} = this.props
    let {currentReply} = this.state
    let reply_id = currentReply ? currentReply.id : null
    let replyUser = currentReply ? '@' + currentReply.author.loginname + ' ' : ''
    let params = {
      reply_id: reply_id,
      content: content,
      content: replyUser + content,
      topicid: info.id,
      accesstoken: user.accesstoken
    }
    replyModalText(params).then(res => {
      if(res.success){
        this.props.onDetail()
        this.closeShowReplyModal()
      }
    })
    // let currentVal = isWeApp ? arguments[1] : arguments[0]
    // console.log(currentVal)
  }
  replyTopicToReply(item){
    this.setState({
      currentReply: item,
      showReplyModal: true
    })
  }
  render(){
    let {info, reply, user} = this.props
    let {showReplyModal} = this.state
    let selfPublic = info.author && user.loginname === info.author.loginname
    return(
      <View className='reply'>
        {
          showReplyModal ? <SelfReply onHideReplyModal={this.closeShowReplyModal.bind(this)} onReplyTextOk={this.handleReplyPlayOk.bind(this)} /> : null
        }
        <TopicInfoContent info={info} selfPublic={selfPublic} />
        <ReplyContent user={user} reply={reply} onHandlePlayOk={this.handlePlayOk.bind(this)} onReplyTopicReply={this.replyTopicToReply.bind(this)} />
        <Button className='reply-btn' onClick={this.handleReplyBtn.bind(this)}>回复</Button>
      </View>
    )
  }
}

export default TopicInfo